<template>
  <div>
    <BannerVue></BannerVue>
    <div class="content">
      <div class="banxin">
        <div class="title">
          <img src="../../assets/line.png" alt=""> 
          <span>服务内容</span>
        </div>
        <div class="info">
          <p>公司的数智化研发提供数字化电子沙盘、BIM模型轻量化查看工具、数字孪生服务。我们针对不同的服务对象提供最周到的服务内容，具体服务内容如下::</p>      
        </div>
      </div>
      <div class="boxs">
        <div class="box">
          <img src="../../assets/point.png" alt="">
          <p class="title">数字化电子沙盘</p>
          <p class="desc">根据项目BIM模型实时还原项目全貌，并且能够实现实施全场景多角度、放大缩小等功能。依据不同季节的景观特点，进行大场景不同季节的展示，展现一天不同时间节点的窗景，可实现早晨、上午、下午、傍晚、晚上不同时间段的窗景展示。</p>
        </div>
        <div class="box box_d">
          <img src="../../assets/point.png" alt="">
          <p class="title">BIM模型轻量化查看工具</p>
          <p class="desc">无需高配置计算机即可查看BIM模型；无需安装第三方软件或APP即可查看模型； 3. 无需账号、密码登录，方便模型转发，交流使用等。</p>
        </div>
        <div class="box">
          <img src="../../assets/point.png" alt="">
          <p class="title">数字孪生</p>
          <p class="desc">充分利用物理模型、传感器更新、运行历史等数据，集成多学科、多物理量、多尺度、多概率的仿真过程，在虚拟空间中完成映射，从而反映相对应的实体装备的全生命周期过程。数字孪生是一种超越现实的概念，可以被视为一个或多个重要的、彼此依赖的装备系统的数字映射系统。         基于详尽的航测数据，进行影像预处理、区域联合评差、多视影响等一系列操作，批量建立高质量、高精度的三维GIS模型。</p>
        </div>
      </div>
    </div>
    <CooperateVue></CooperateVue>
    <FootVue></FootVue>
  </div>
</template>

<script>
import BannerVue from '@/components/Banner/index.vue'
import CooperateVue from '@/components/Cooperate/index.vue'
import FootVue from '@/components/Foot/index.vue'

export default {
  name: 'MainLayout',
  components: {
    BannerVue,
    CooperateVue,
    FootVue
  },
  setup () {
    return {
    }
  }
}
</script>

<style lang="scss" scoped>
.active{
  color: rgba(0, 96, 255, 1);
}
.content{
  height: 8.75rem;
  padding: .625rem 0;
  .title{
    display: flex;
    align-items: center;
    font-weight: 700;
    img{
      margin-right: .125rem;
      height: .375rem;
    }
    span{
      font-size: .3rem;
    }
  }
  .info{
    text-indent: 2em;
    color: rgba(102, 102, 102, 1);
    line-height: .375rem;
    margin-top: .625rem;
  }
  .boxs{
    display: flex;
    justify-content: space-between;
    width: 17rem;
    margin: .625rem auto;
    .box{
      width: 33%;
      height: 4.25rem;
      position: relative;
      color: aliceblue;
      padding: .375rem;
      margin:0 .0625rem;
      background-color: rgba(140, 185, 254, 1);
      img{
        width: .18rem;
        display: block;
      }
      .title{
        font-size: .225rem;
        line-height: .375rem;
      }
      .desc{
        // margin-top: 20px;
        width: 80%;
        position: absolute;
        bottom: 5%;
      }
    }
    .box_d{
      background-color: rgba(102, 162, 254, 1);
    }
  }
}

</style>